<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <!-- <link rel="stylesheet" type="text/css" href="/css/style.css"> -->
    <!-- <link rel="stylesheet" type="text/css" href="css/demo.css"> -->
    <!-- <link rel="stylesheet" type="text/css" href="css/wp-syntax.css"> -->
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="js/Validform_v5.3.2.js"></script>
    <style type="text/css" >
        /*==========以下部分是Validform必须的===========*/
            .Validform_checktip{
                margin-left:8px;
                line-height:20px;
                height:20px;
                overflow:hidden;
                color:#999;
                font-size:12px;
            }
            .Validform_right{
                color:#71b83d;
                padding-left:20px;
                background:url(images/right.png) no-repeat left center;
            }
            .Validform_wrong{
                color:red;
                padding-left:20px;
                white-space:nowrap;
                background:url(images/error.png) no-repeat left center;
            }
            .Validform_loading{
                padding-left:20px;
                background:url(images/onLoad.gif) no-repeat left center;
            }
            .Validform_error{
                background-color:#ffe7e7;
            }
            #Validform_msg{color:#7d8289; font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif; width:280px; -webkit-box-shadow:2px 2px 3px #aaa; -moz-box-shadow:2px 2px 3px #aaa; background:#fff; position:absolute; top:0px; right:50px; z-index:99999; display:none;filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999');}
            #Validform_msg .iframe{position:absolute; left:0px; top:-1px; z-index:-1;}
            #Validform_msg .Validform_title{line-height:25px; height:25px; text-align:left; font-weight:bold; padding:0 8px; color:#fff; position:relative; background-color:#000;}
            #Validform_msg a.Validform_close:link,#Validform_msg a.Validform_close:visited{line-height:22px; position:absolute; right:8px; top:0px; color:#fff; text-decoration:none;}
            #Validform_msg a.Validform_close:hover{color:#cc0;}
            #Validform_msg .Validform_info{padding:8px;border:1px solid #000; border-top:none; text-align:left;}
           /*body{background-color: #FFF;}*/
    </style>
</head>
<body>
    <form class="demoform">
        <div>
            名字：<input type="text" name="name" value="" datatype="s5-16" errormsg="5到16个字符"/>
        </div>
        <div class="Validform_checktip"></div>
        <div>
            密码：<input type="password" value="" name="userpassword" datatype="*6-16" nullmsg="请设置密码！" errormsg="密码范围在6~16位之间！" />
        </div>
        <div class="Validform_checktip"></div>
        <div>
            确认密码：<input type="password"  name="userpassword2" datatype="*" recheck="userpassword" nullmsg="请再输入一次密码！" errormsg="您两次输入的账号密码不一致！" />
        </div>
        <div class="Validform_checktip"></div>
        <div>
            <input type="submit" value="提 交" /> 
            <input type="reset" value="重 置" />
        </div>
    </form>
    <script type="text/javascript">
        $(".demoform").Validform();
    </script>
</body>
</html>